<template>
	<view>
		<!-- 将原来的详情页（/pages/detail/detail.vue），作为一个组件(pages-detail-detail)使用 -->
		<pages-video-history ref="videoPage" v-if="show=='video'?true:false"></pages-video-history>
		<pages-chat-history ref="chatPage" v-if="show=='chat'?true:false"></pages-chat-history>
		<pages-dub-history ref="dubPage" v-if="show=='dub'?true:false"></pages-dub-history>
		<pages-mapping-history ref="mappingPage" v-if="show=='mapping'?true:false"></pages-mapping-history>
		<pages-resolution-history ref="resolutionPage" v-if="show=='resolution'?true:false"></pages-resolution-history>
		<pages-tourism-history ref="tourismPage" v-if="show=='tourism'?true:false"></pages-tourism-history>
		<pages-my-index ref="myPage" v-if="show=='my'?true:false"></pages-my-index>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				show: 'chat',
			}
		},
		created(e) {
			var that = this;
			// 监听自定义事件， 该事件由左侧列表页的点击触发
			var data = this.show + 'Page';
			uni.$on(data, (e) => {
				// 执行 detailPage组件，即：/pages/detail/detail.vue 页面的load方法  
				this.$refs.detailPage.load(e.detail);
			})
		},
		watch: {
			// #ifndef VUE3
			$route: {
				immediate: true,
				handler(newRoute) {
					this.handlerRoute(newRoute)
				}
			},
			// #endif
			// #ifdef VUE3
			$route(newRoute) {
				this.handlerRoute(newRoute)
			}
			// #endif

		},

		methods: {
			handlerRoute(newRoute) {
				const width = uni.$uv.sys().screenWidth
				if (width >= 768) {
					let path = newRoute.path
					let comp
					if (path === '/') {
						comp = 'chat'
					} else {
						comp = path.split('/')[2]
					}
					this.show = comp;
					// console.log(path);
					if (path == '/pages/my/index') {
						let path = '/pages/my/invite'
						uni.$uv.route({
							url: path,
							type: "redirectTo",
						});
					}
				}
			}
		}
	}
</script>